<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>websocket</title>
    <script>
        var socket;
        if(typeof(WebSocket) == "undefined"){
            console.log("您的浏览器不支持WebSocket");
        }else{
            console.log("您的浏览器支持WebSocket");
            //实现化WebSocket对象，指定要连接的服务器地址与端口  建立连接
            socket = new WebSocket("ws://localhost:18085/socket/zhangsan");//打开事件
            socket.onopen = function() {
                console.log("Socket 已打开");
            };
            //获得消息事件
            socket.onmessage = function(msg) {
                console.log(msg.data);
                //发现消息进入后台
                let doc=document.getElementById("msg");
                doc.append(msg.data);
            };//关闭事件
            socket.onclose = function() {
                console.log("Socket已关闭");
            };//发生了错误事件
            socket.onerror = function() {
                alert("Socket发生了错误");
            }
            //关闭连接
            function closeWebSocket() {
                socket.close();
            }
            function sendMsg(){
               socket.send("hello server");
            }
        }
    </script>
</head>
<body>
<div>
    <button onclick="sendMsg()">发送消息</button>
</div>
<div id="msg">
</div>
</body>
</html>